import QtQuick 2.14
import QtQuick.Controls 2.14

Item
{
    id: root
    signal preImage()
    signal nextImage()
    signal sigCopy()

    clip: true
    Flickable {
        id: id_flickable
        anchors.fill: parent
        contentWidth:  width  > imgWidth()  ?  width  : imgWidth()
        contentHeight: height > imgHeight() ?  height : imgHeight()
        boundsBehavior: Flickable.StopAtBounds
        boundsMovement: Flickable.StopAtBounds
        ScrollBar.horizontal: ScrollBar {
            policy:  ScrollBar.AlwaysOn
            visible: id_flickable.contentWidth > id_flickable.width
        }
        ScrollBar.vertical: ScrollBar {
            policy:  ScrollBar.AlwaysOn
            visible: id_flickable.contentHeight > id_flickable.height
        }

        Image {
            id: image
            source: ""
            cache: false
            asynchronous: true
            x: imgX() + (imgWidth() - sourceSize.width) / 2
            y: imgY() + (imgHeight() - sourceSize.height) / 2
            smooth: true
            onStatusChanged: {
                if(status === Image.Ready)
                    tools_bar.fillShow()
            }
        }
    }

    Item {
        anchors.fill: parent

        visible: image.source.toString() !== ""

        Text {
            x: 8
            y: 8
            color: "white"
            text: "\n 文件: " + image.source.toString().substring(7) +
                  "\n 缩放: " + image.scale +
                  "\n 旋转:" + image.rotation +
                  "\n 分辨率:" + image.sourceSize.width + " x " + image.sourceSize.height +
                  "\n"
        }

        Button {
            text: "<"
            width: 48
            height: 72
            anchors.verticalCenter: parent.verticalCenter
            anchors.left: parent.left
            anchors.leftMargin: 8
            font.pixelSize: 32
            background: Rectangle {
                color: "#DDFFFFFF"
            }
            onClicked: preImage()
        }

        Button {
            text: ">"
            width: 48
            height: 72
            anchors.verticalCenter: parent.verticalCenter
            anchors.right: parent.right
            anchors.rightMargin: 8
            font.pixelSize: 32
            background: Rectangle {
                color: "#DDFFFFFF"
            }
            onClicked: nextImage()
        }

        ImageFunctionBar {
            id: tools_bar
            _image: image
            width: 660
            height: 60
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 20
            onSigCopy: root.sigCopy()
        }

    }



    function showImage(img)
    {
        image.source = "file://" + img
        image.scale = 1.0
        image.rotation = 0
    }

    //获取 旋转后&缩放后的 宽度
    function imgWidth() {
        //如果旋转90 180，返回宽度*缩放
        var w = ((image.rotation / 90) % 2) == 0 ? image.width : image.height
        return parseInt(w * image.scale)
    }

    //获取 旋转后&缩放后的 高度
    function imgHeight() {
        var w = ((image.rotation / 90) % 2) == 0 ? image.height : image.width
        return parseInt(w * image.scale)
    }

    //理论坐标
    //获取 旋转后&缩放后的 居中坐标x
    function imgX() {
        var picw = imgWidth()
        var conw = id_flickable.width
        if(picw < conw)
            return parseInt((conw-picw)/2)
        return 0
    }

    //获取 旋转后&缩放后的 居中坐标y
    function imgY() {
        var pich = imgHeight()
        var conh = id_flickable.height
        if(pich < conh)
            return parseInt((conh-pich)/2)
        return 0
    }

}
